<template>
	<div>
		<div class="head">
			<a @click="$router.push({path: '/Prize'})" class="return"></a>
      {{$t('OrderPage.v1')}}
		</div>
		<div class="overlay">
			<div class="overlay-content scrolling">
				<div class="increase2">
					<div class="hd" v-show="info.status == 0" style="color:#339966;">{{$t('OrderPage.v2')}}</div>
					<div class="hd" v-show="info.status == 1" style="color:#339966;">{{$t('OrderPage.v3')}}</div>
					<div v-show="info.status == 1">
						<div class="bd">{{$t('OrderPage.v4')}}：{{info.logisticsCompany}}</div>
						<div class="bd">{{$t('OrderPage.v5')}}：{{info.logisticsNum}}</div>
						<div class="bd">{{$t('OrderPage.v6')}}：{{info.createTime | dateFormat('YYYY-MM-DD HH:mm:ss')}}</div>
					</div>
				</div>
				<!-- 收货地址 -->
				<div class="increase2" v-show="list.type == 3">
					<div class="hd">{{info.receiveName}} <span>{{info.receivePhone}}</span></div>
					<div class="bd">{{info.receiveAddress}}</div>
				</div>

				<div class="cp">
					<!-- <div class="title vux-1px-b">{{$moment(list.nowTime).utcOffset(480).format("YYYY-MM-DD HH:MM:SS")}}</div> -->
					<!-- <div class="title vux-1px-b">{{list.nowTime | dateFormat('YYYY-MM-DD HH:mm:ss')}}</div> -->
					<div class="weui-flex vux-1px-b" style="padding-bottom:10px;">
						<div class>
							<img class="img" :src="list.picture" alt />
						</div>
						<div class="weui-flex__item">
							<div class="bt">{{list.title}}</div>
							<div class="price">
								<span>￥{{parseFloat(list.price ? list.price : '0.00').toFixed(3).slice(0,-1)}}</span> <span class="count">x 1</span>
							</div>
						</div>
					</div>
					<div class="weui-flex freight">
						<div class="weui-flex__item">{{$t('OrderPage.v7')}}</div>
						<div>{{parseFloat(list.freight ? list.freight : '0.00').toFixed(3).slice(0,-1)}} EXUU</div>
					</div>
					<div class="weui-flex freight">
						<div class="weui-flex__item">{{$t('OrderPage.v8')}}</div>
						<div class="delete">￥{{parseFloat(list.price ? list.price : '0.00').toFixed(3).slice(0,-1)}}</div>
					</div>
				</div>

			</div>
		</div>

		<!-- <div class="weui-flex weui-fixed-btm vux-1px-t">
       <div class="weui-flex__item tar"><span>合计：¥199.00</span></div>
       <div class="btn">领取奖品</div>
    </div> -->

	</div>
</template>

<script>
	import { dateFormat } from 'vux'
	import { recreation, mine, base } from './../../utils/api';
	export default {
		data() {
			return {
				list: [],
				info: []
			}
		},
		mounted() {
			//商品
			recreation.getOrder({
				'id': sessionStorage.id2,
			}).then(res => {
				this.list = res.data
			});
			//查询是否有默认地址
			recreation.getLogisticsInfo({
				'id': sessionStorage.id2
			}).then(res => {
				this.info = res.data;
			})
		},
		methods: {

		},
		filters: {
			dateFormat
		}
	};
</script>

<style lang="less" scoped>
	.overlay {
		background: rgb(245, 245, 245);
	}

	.head {
		background: white;
		color: black;
	}

	.head .return:after {
		border-color: #000;
	}

	.increase {
		background: #fff;
		color: #666;
		text-align: center;
		padding: 16px 0;
		margin: 10px 0;
	}

	.increase2 {
		position: relative;
		background: #fff;
		color: #333;
		padding: 10px 30px 10px 10px;
		margin-bottom: 10px;
		.hd {
			span {
				color: #999;
			}
		}
		.bd {
			font-size: 13px;
		}
		.green {
			color: #339966;
		}
	}

	.cp {
		background: #fff;
		color: #333;
		padding: 10px;
		.img {
			width: 80px;
			height: 80px;
			margin-right: 10px;
		}
		.bt {
			height: 50px;
			line-height: 140%;
			font-size: 13px;
		}
		.count {
			color: #999;
		}
		.title {
			padding: 0 0 10px;
			margin-bottom: 10px;
		}
		.freight {
			padding: 5px 0;
			font-size: 12px;
		}
		.delete {
			text-decoration: line-through;
		}
	}

	.weui-fixed-btm {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		background: #fff;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		.btn {
			padding: 14px 20px;
			background: #3ca76d;
			color: #fff;
		}
		.weui-flex__item {
			span {
				padding-top: 14px;
				display: block;
				padding-right: 10px;
				text-decoration: line-through;
			}
		}
	}
</style>
